<import file="block/common.html" name="url"/>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <blockquote class="layui-elem-quote">
                        <h5>记录方式：page view</h5>
                        <h4>近30天访问</h4>
                    </blockquote>
                </div>
            </div>
        </div>
        <div class="layui-col-md12">
            <div style="width:100%;">
                <canvas id="canvasMonth" width="400" height="100"></canvas>
            </div>
        </div>
    </div>

</div>
<script src="<{U_ROOT}>/res/lib/chart/Chart.min.js"></script>
<script>
    var configMonth = {
        type: 'line',
        data: {
            labels: [
                <?php foreach($visits as $vo){
                    echo fTime($vo['date'], 'Ymd').',';
        } ?>
    ],
    datasets: [{
        label: '当天访问量',
        //backgroundColor: '#dfecfe',
        borderColor: '#a000e2',
        data: [
                <?php foreach($visits as $vo){
                echo $vo['visits'].',';
            } ?>
        ]
    }]
    },
    options: {
        responsive: true,
            title: {
            display: true,
                text: '网站访问量'
        },
        tooltips: {
            mode: 'index',
                intersect: false,
            },
        hover: {
            mode: 'nearest',
                intersect: true
        },
        scales: {
            xAxes: [{
                display: true,
                scaleLabel: {
                    display: true,
                    labelString: '日期'
                }
            }],
                yAxes: [{
                    display: true,
                    scaleLabel: {
                        display: true,
                        labelString: '访问次数'
                    }
                }]
        }
    }
    };
    var ctxMonth = document.getElementById('canvasMonth').getContext('2d');
    var month = new Chart(ctxMonth, configMonth);

</script>